<meta charset="utf-8"/> <!-- 设置编码方式 -->
<link rel="icon" href="../images/5.ico" /><!--设置图标-->
<!-- 开发环境版本，包含了有帮助的命令行警告 -->
<script src="../ExternalLibrary/js/vue.js"></script>
<div id="vueId">
	{{message}}<!--此处会将{{message}}替换为对象属性的值-->
</div>

<script>
	//任何一个作者都不会自大到,自己写的框架天下第一,所以vue只接管需要vue负责的东西,不需要vue负责的,vue就不管。
	//这也是非侵入式的设计思想
	var app = new Vue({
		el:"#vueId",//我要管哪个元素,与设计思想谋和
		data:{
			message:"hello "
		}
	})

	app.message = '学习vue';//修改实时生效
</script>

1.输出
	{{}}

2.双向绑定
	v-model

3.属性绑定
	常规写法：  v-bind:属性="数据"
	简写：     :属性="数据"

	2种特殊处理
		:style="json"
		:class="arr"

4.事件
	常规写法:	v-on:xxxx="函数"
	简写:		@xxx="函数"		（为什么不用：呢？如果用的话就冲突了）

	特殊处理
		v-on:click => @click => :onclick  三者相等
	
	计算属性

5.循环
	v-for="val,key in 数组"
	v-for="val,key in json"

6.v-if 与 v-show
	v-show:display
	v-if:删除html元素

7.修饰符
	事件修饰符
	表单修饰符
	按键修饰符(按键也是触发的事件)

8.路由
	1,路由原理：地址变了,调用不同的代码。就是一堆if-else。
	2,路由参数： #/xxx/:x/:x/:x?a=xx&b=xx(这样可以传多个参数)
				$route.params 取:x/:x/:x(?号之前的参数)
				$route.query  取:a=xx&b=xx(?号之后的参数)
	3,路由事件
		beforeRouteUpdate()监听路由的变化之一
	4,命名路由
		全路径
		json=>{name:"名字",params:{},query:{}}
	5,嵌套路由(子路由)

	$route  信息
	$ruoter 操作

9.组件
	1,组件命名的两种方式
	2,父子组件通信
		父->子:实际上就是自己给自己传
		子->父:函数

10.生命周期函数
	beforecreated:加一些loading事件
	created：结束loading事件，还做一些初始化，实现函数自执行
	mounted：发起后端请求，取回数据
		接受页面之间传递的参数
		子组件向父组件传递参数


